<script setup>
const { title, desc } = defineProps(['title', 'desc'])
</script>
<template>
	<div class="home-panel">
		<div class="container">
			<!-- big title -->
			<div class="head">
				<h3>{{ title }} <small>{{desc}}</small></h3>
			</div>
			<!-- recommend products -->
			<div class="recommend">
				<slot>
				</slot>
			</div>
		</div>
	</div>
</template>

<style scoped lang="scss">
.home-panel {
	.head {
		padding: 20px 0;

		h3 {
			font-weight: 400;
			font-size: 24px;

			small {
				margin-left: 10px;
				font-size: 14px;
				color: #999;
			}
		}
	}
}
</style>